<template>
  <div class="sort">
    <van-dropdown-menu>
      <van-dropdown-item
        v-model="category"
        :options="categories"
        @change="categoryChange"
      />
      <van-dropdown-item
        v-model="ordering"
        :options="orderings"
        @change="orderingChange"
      />
    </van-dropdown-menu>
  </div>
</template>

<script>
export default {
  data() {
    return {
      category: 0,
      ordering: 0,
      categories: [
        { text: "全部", value: 0 },
        { text: "分享", value: 1 },
        { text: "闲聊", value: 2 },
        { text: "问答", value: 3 },
      ],
      orderings: [
        { text: "综合", value: 0 },
        { text: "最新", value: 1 },
        { text: "浏览量", value: 2 },
      ],
    };
  },
  methods: {
    categoryChange(value) {
      if (value == 0) {
        value = "";
      }
      this.$emit("refreshCategory", value);
    },
    orderingChange(value) {
      if (value == 1) {
        value = "-create_time";
      } else if (value == 2) {
        value = "-clicks";
      } else {
        value = "";
      }
      this.$emit("refreshOrdering", value);
    },
  },
};
</script>

<style></style>
